<template>
  <div id="LoanApplication">
    <div class="SQList">
      <ul style="clear: both" v-if="contentData.length > 0">
        <li v-for="(item, index) in contentData" @click="contentDataClick(item)" :key="index">
          <p style="font-weight: bold; height: 30px">
            <span style="float: left">安居贷</span>
            <span style="float: right">惠州农信</span>
          </p>
          <p style="font-size: 14px; color: #848484; height: 30px">
            <span style="float: left">进度：{{ item.loanLimit?'发起贷款申请':'评估中' }}</span>
            <span style="float: right">申请农户：{{ item.name }}</span>
          </p>
          <p style="font-size: 14px; color: #848484; height: 30px">
            <span style="float: left">地址：{{ item.buildArea?item.buildArea:'暂无数据' }}</span>
          </p>
        </li>
      </ul>
      <div style="height: 60vh;text-align:center;padding-top: 20vh;" v-else>
        <div style="margin-bottom: 10px;">
          <img src="https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/DSF/50.png" />
        </div>
        <div>暂无数据</div>
      </div>
    </div>
    <div class="bottom">
      <ul>
        <li v-for="(item, index) in bottomData" :key="index" @click="bottomClick(index)" v-show="($store.state.isGJ &&  (item.name==='首页' || item.name==='我的待办' || item.name==='我的收藏') )||(!$store.state.isGJ && ( item.name==='首页' || item.name==='我的待办'))" :style="{ color: nowIndex === index ? '#007AFF' : '#908f94',fontSize:'18px',width:$store.state.isGJ?'33.3%':'50%' }">
          <img v-if="nowIndex === index" :src="item.icon" />
          <img v-else :src="item.icons" />
          <p>{{ item.name }}</p>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
import { QuerySignCallback } from '../../utils/api'
export default {
  name: 'LoanApplication',
  data() {
    return {
      nowIndex: 1,
      contentData: [],
      bottomData: [
        {
          name: '首页',
          icon: 'https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/ZLJ/20.png',
          icons: 'https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/ZLJ/20-1.png'
        },
        {
          name: '我的待办',
          icons: 'https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/ZLJ/21.png',
          icon: 'https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/ZLJ/21-1.png'
        },
        {
          name: '我的收藏',
          icons: 'https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/ZLJ/22.png',
          icon: 'https://nfzjszlb.jst.zj.gov.cn/serverfile/zheliban/icon/ZLJ/22-1.png'
        }
      ]
    }
  },
  methods: {
    bottomClick(index) {
      switch (index) {
        case 0:
          this.$router.push({
            path: '/'
          })
          break
        case 1:
          this.$router.push({
            path: 'MyAgent'
          })
          break
        case 2:
          this.$router.push({
            path: 'MyEnshrine'
          })
          break
      }
    },
    getcontentData: async function () {
      let idcard = JSON.parse(window.localStorage.getItem("userName")) ? JSON.parse(window.localStorage.getItem("userName")).idcard : ""
      let params = {
        accessCode: "",
        appKey: "",
        certNums: idcard
      }
      const res = await GetPrecredit(params);
      this.contentData = res.data.data
    },
    contentDataClick(item) {
      if (item.loanLimit) {
        this.$router.push({
          path: "LoanResults",
          query: {
            data: JSON.stringify(item),
            type: "申请"
          }
        })
      } else {
        this.$router.push({
          path: "LoanResults",
          query: {
            data: JSON.stringify(item),
            type: "评估"
          }
        })
      }
    }
  },
  mounted() {
    this.getcontentData()
    if (ZWJSBridge) {
      ZWJSBridge.setTitle({
        title: '我的待办'
      })
        .then(res => {
        })
        .catch(err => {
        })
    }
  }
}
</script>

<style scoped lang="scss">
#LoanApplication {
  .SQList {
    width: 100vw;
    overflow-x: hidden;
    height: calc(100vh - 0.88rem);
    overflow-y: auto;
    background: #fff;
    padding: 0 10px;
    li {
      padding-top: 10px;
      border-bottom: 1px solid #d2d2d2;
    }
  }
  .bottom {
    clear: both;
    position: fixed;
    bottom: 0;
    // height: 100px;
    width: 100%;
    text-align: center;
    height: 0.88rem;
    background: #ffffff;
    border-top: 1px solid #d2d2d2;
    ul {
      width: 100%;
      height: 100%;
      clear: both;
      overflow: hidden;
      display: flex;
      align-items: center;
      li {
        float: left;
        width: 33.3%;
        font-size: 14px !important;
        img {
          height: 18px;
          margin-bottom: 0.0130px;
        }
      }
    }
  }
}
</style>
